import { CSSProperties } from 'vue';
import { RuleItem } from './rule';

// 可配置的表单配置
export interface FormOptions {
  // 表单项渲染
  type: 'cascader' | 'input' | 'select' | 'option' | 'color-picker' | 'date-picker' | 'input-number' | 'radio' | 'radio-group' | 'checkbox' | 'checkbox-group' | 'rate' | 'slider' | 'switch' | 'time-picker' | 'time-select' | 'transfer' | 'upload' | 'editor',
  // 表单项的唯一标识
  prop?: string,
  // 表单项的 label
  label?: string,
  // 表单项的值
  value?: any,
  // 表单项验证规则
  rules?: RuleItem[],
  // 表单项自定义验证规则
  validator?: (rule: any, value: any, callback: any) => void,
  // 表单项提示占位
  placeholder?: string,
  // 可选参数
  attrs?: {
    clearable?: boolean,
    showPassword?: boolean,
    disabled?: boolean,
    // css样式选项
    style?: CSSProperties
  },
  // 自定义插槽的名字
  slotName?: string,
  // 表单的子项配置
  children?: FormOptions[],
  // 上传文件属性的配置
  uploadAttrs?: {
    action: string,
    headers?: object,
    method?: 'post' | 'put' | 'patch',
    multiple?: boolean,
    data?: object,
    name?: string,
    withCredentials?: boolean,
    showFileList?: boolean,
    drag?: boolean,
    accept?: string,
    thumbnailMode?: boolean,
    fileList?: any[],
    autoUpload?: boolean,
    disabled?: boolean,
    limit?: number,
  },
  // 上传文件方法的配置
  uploadMethods?: {
    onPreview?: (file: File) => void,
    onRemove?: (file: File, fileList: FileList) => void,
    onSuccess?: (response: any, file: File, fileList: FileList) => void,
    onError?: (err: any, file: File, fileList: FileList) => void,
    onProgress?: (event: any, file: File, fileList: FileList) => void,
    onChange?: (file: File, fileList: FileList) => void,
    onBeforeUpload?: (file: File) => void,
    onBeforeRemove?: (file: File, fileList: FileList) => void,
    onHttpRequest?: () => void,
    onExceed?: (file: File, fileList: FileList) => void,
  }
}